<template>
	<view class="certification-pop">
		<view class="pop-shadow"></view>
		<view class="certification-pop__box">
			<image class="certification-pop__bg" :src="$imgUrl('/components/certificationpop/bg-cer.png')" mode="widthFix"></image>
			<view class="certification-pop__text">
				<view>请拨打您的系统专员电话</view>
				<view>0370-1234 123</view>
			</view>
			<view class="certification-pop__button" @click="toDoingPhone">立即拨打</view>
			<view class="certification-pop__cancel" @click="closeWindow">取消</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'systemSpecial',
		data() {
			return {}
		},
		onLoad() {},
		methods: {
			// 拨打您的系统专员电话
			toDoingPhone () {
				uni.makePhoneCall({
					phoneNumber: '0370-1234 123'
				})
			},
			// 关闭弹窗
			closeWindow () {
				this.$emit('closeWindow')
			}
		}
	}
</script>

<style scoped lang="scss">
.certification-pop {
	
	.certification-pop__box{
		position: fixed;
		left: 50%;
		top: 50%;
		z-index: 20001;
		transform: translate(-50%, -50%);
		width: 570rpx;
		height: 645rpx;
		background-color: #FFFFFF;
		border-radius: 32px;
	}
	
	.pop-shadow{
		position: fixed;
		top: 0;
		left: 0;
		z-index: 20000;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
	}
	
	.certification-pop__bg{
		width: 570rpx;
		height: 246rpx;
	}
	
	.certification-pop__text{
		font-size: 34rpx;
		font-weight: bold;
		color: #333333;
		text-align: center;
		margin: 54rpx 0;
	}
	
	.certification-pop__button{
		width: 412rpx;
		height: 80rpx;
		background: #2FCC71;
		box-shadow: 0rpx 10rpx 20rpx 0rpx rgba(47,204,113,0.25);
		border-radius: 40rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #FFFFFF;
		text-shadow: 0rpx 10rpx 20rpx rgba(47,204,113,0.25);
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
	}

	.certification-pop__cancel{
		width: 80rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #2FCC71;
		margin: 0 auto;
		margin-top: 32rpx;
		text-align: center;
	}
}
</style>